<template>
	<div class="shopbody">
		<div class="shop">
			<i class="el-icon-s-data">商品列表-修改</i>
			<el-button @click="goadd()">添加新的商品</el-button>
			<span>支持2层的类型</span>
		</div>
		<el-table :data="list">
			<el-table-column prop="name" label="书名"></el-table-column>
			<el-table-column prop="sn" label="编号"></el-table-column>
			<el-table-column prop="author" label="作者"></el-table-column>
			<el-table-column prop="maker" label="出版社"></el-table-column>
			<el-table-column prop="tmake" label="日期"></el-table-column>
			<el-table-column prop="stock" label="库存"></el-table-column>
			<el-table-column label="图片">
				<template slot-scope="scope">
					<img :src="`${$ip}/api/public/showimg/${scope.row.pic}`" min-width="70" height="70"
						style="height: 50PX;width: 80px;" />
				</template>
			</el-table-column>
			<el-table-column label="操作">
				<template slot-scope="scope">
					<el-button style="background-color: #00BFFF;" @click="up(scope.row)">修改</el-button>
				</template>
			</el-table-column>
		</el-table>
		<el-pagination style="margin-left: 40%; margin-top: 30px;" :page-size="num" @current-change="change"
			:current-page="page" background layout="prev, pager, next" :total="total">
		</el-pagination>
	</div>
</template>

<script>
	export default {
		name: 'shoplist',
		data() {
			return {
				list: [],
				page: 1,
				num: 3,
				total: 0
			}
		},
		methods: {
			goadd(){
				this.$router.push('/bookbackend/endbackaddshop')
			},
			show() {
				this.$get("/api/adm/book/findByPage/" + this.page + "/" + this.num).then((resp) => {
					// console.log(resp.data.data.total);
					this.total = resp.data.data.total;
					this.list = resp.data.data.books;
					console.log(resp.data.data.books);
					this.list.forEach((item) => {
						let k = new Date(item.tmake);
						let str = "";
						let year = k.getFullYear();
						let month = k.getMonth() + 1;
						let day = k.getDate();
						str = year + "/" + month + "/" + day;
						item.tmake = str;
					})
					// console.log(resp.data.data);
				})
			},
			change(val) {
				console.log("页面更新数据值:" + val);
				this.page = val;
				this.show();
			},
			up(t) {
				console.log("书本id"+t.id);
				this.$router.push({
					path: '/bookbackend/endbackupdateshop',
					query: {
						name: t
					}
				});
			}
		},
		mounted() {
			this.show();
		}
	}
</script>

<style>
	.shopbody {
		width: 90%;
		/* background-color: #00BFFF; */
		margin-left: 2%;
	}


	.shop {
		width: 100%;
		display: flex;
		line-height: 40px;
	}

	.shop i {
		line-height: 40px;
		margin-left: 1%;
	}

	.shop button {
		margin-left: 55%;
	}

	.shop span {
		margin-left: 1%;
	}
</style>